import { Avatar, Modal } from "antd";
import LoginView from "@/components/login/index";
import { useState } from "react";
import styleModule from "./index.module.scss";
import { UserOutlined } from "@ant-design/icons";
function User() {
	const [isModalOpen, setIsModalOpen] = useState(false);

	const showModal = () => {
		setIsModalOpen(true);
	};

	const handleOk = () => {
		setIsModalOpen(false);
	};

	const handleCancel = () => {
		setIsModalOpen(false);
	};
	return (
		<>
			<div className={styleModule.user}>
				<Avatar
					className={styleModule.avatar}
					onClick={showModal}
					icon={<UserOutlined />}
				/>
				<div className={styleModule.popover}>个人中心</div>
			</div>
			<Modal
				className={styleModule.loginDialog}
				open={isModalOpen}
				footer={null}
				onOk={handleOk}
				onCancel={handleCancel}
				closable={false}
			>
				<LoginView />
			</Modal>
		</>
	);
}
export default User;
